<template>
  <div class="login">
    <h1>欢迎登录</h1>
    <p><label>用户名：</label><input type="text" v-model="name" placeholder="请输入用户名"> </p>
    <p><label>密&nbsp;&nbsp;&nbsp;&nbsp;码：</label><input v-model="passward" type="password" placeholder="请输入密码"></p>
    <div class="clearfix"><span class="fr forgetpaw" @click="forgetpws">忘记密码？</span></div>
    <!-- <a href="{path:'index'}">登录</a> -->
    <p><button  @click="nice" class="btn">登录</button></p>
   <p>若您没有账号请前往<button @click="gorigest">注册</button></p>
   </div>
</template>

<script>
export default {
  name: "login",
  data() {
    return {
      msg: "这是登录页面",
      name: "",
      passward: "",
      //ip: ""
    };
  },
  created() {
    //this.getip();
    this.islogin()
  },
  methods: {
    islogin () {
      this.$http.get("http://medical.qingguo188.com/user/islogin").then(
        res => {
          if(res.data.status == 1) {
            this.$router.push({ path: "index" });
          }else if(res.data.status != 4){
              this.$layer.alert(res.data.$message)
          }
        },
        () => {
          this.$layer.alert("网络错误！");
        }
      );
    },
    // getip() {
    //   var _this = this;
    //   this.$http.get("http://freegeoip.net/json/").then(
    //     data => {
    //       this.ip = data.data.ip;
    //     },
    //     function() {
    //       _this.$layer.alert("网络错误！");
    //     }
    //   );
    // },
    nice() {
      //alert(0)
      if (this.name == "" || this.passward == "") {
        this.$layer.alert("用户名或者密码不能为空！");
        return false;
      }
      var _this = this;
      this.$http
        .post(
          "http://medical.qingguo188.com/user/dologin",
          {
            phone: this.name,
            password: this.passward,
            ip: this.ip
          }
        )
        .then(
          rester => {
            console.log(rester);
            if (rester.data.status == 1) {
              console.log(rester.data.$message);
              this.$layer.msg("登录成功！");
              localStorage.setItem(
                "user",
                JSON.stringify(rester.data.$message)
              );
                _this.$router.push({ path: "index" }); //登录成功跳转页面;
            } else {
              this.$layer.alert(rester.data.$message);
            }
          },
          () => {
            this.$layer.alert("网络错误！");
          }
        );
    },
    gorigest() {
      this.$router.push({ path: "regist" }); //跳转注册页面
    },
    forgetpws() {
      this.$router.push({ path: "forgetpws" }); //跳转忘记密码页面
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1 {
  text-align: center;
  line-height: 2;
  font-size: 24px;
}
p {
  text-align: center;
  margin-top: 20px;
}
.forgetpaw {
  color: #008df6;
  margin-top: 10px;
  margin-right: 100px;
  cursor: pointer;
}
body {
  color: #f1f1f1;
}
.login {
  width: 500px;

  position: relative;
  border: 1px solid #dedede;
  left: 50%;
  top: 200px;
  margin-left: -250px;
  padding: 20px;
}
label {
  display: inline-block;
  width: 70px;
  text-align: center;
}
</style>
